<template>
    <div>
        <div class="">
            <div style="height:30px;margin-top:3px">
                <Button type="primary" @click="handleAdd()">录入
                </Button>
                <Modal v-model="modalSs11006" title="录入财产-房产" width="900" style="position:relative;">
                    <Spin v-if="LoadingModal" size="large" fix></Spin>
                    <Form ref="dataSs11007" :model="dataSs11007" :rules="rules" inline :label-width="160"
                          :disabled="disableSubmit">
                        <table style="width:100%;">
                            <tr>
                                <td>
                                    <FormItem label="人员姓名" prop="ssbe0001">
                                        <dictSelect :sel_val='dataSs11007.ssbe0001' dicType="service"
                                                    :bindData.sync="dataSs11007.ssbe0001" :serviceParam="serviceParam"
                                                    dictService="/api/ac/subsistence/ss11002Service/getAssistanceMemberList"
                                                    class="itemStyle" style="width: 200px"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="房产证编号">
                                        <Input v-model="dataSs11007.ssbe0002" style="width: 200px" maxlength="20"
                                               placeholder="请输入房产证编号"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="房屋坐落地址">
                                        <Input v-model="dataSs11007.ssbe0003" style="width: 200px" maxlength="80"
                                               placeholder="请输入房屋坐落地址"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="是否实际居住房产">
                                        <dictSelect :sel_val='dataSs11007.ssbe0004' dictCode="yesorno"
                                                    :bindData.sync="dataSs11007.ssbe0004" style="width: 200px" clearable
                                                    placeholder="请选择是否实际居住房产"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="住房情况" prop="ssbe0005">
                                        <dictSelect :sel_val='dataSs11007.ssbe0005' dictCode="housenature"
                                                    :bindData.sync="dataSs11007.ssbe0005" style="width: 200px" clearable
                                                    placeholder="请选择住房情况"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="住房情况详细分类">
                                        <dictSelect :sel_val='dataSs11007.ssbe0006' dictCode="housenature_child"
                                                    :bindData.sync="dataSs11007.ssbe0006" style="width: 200px" clearable
                                                    placeholder="请选择住房情况详细分类"/>

                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="房屋类型" prop="ssbe0007">
                                        <dictSelect :sel_val='dataSs11007.ssbe0007' dictCode="housetype"
                                                    :bindData.sync="dataSs11007.ssbe0007" style="width: 200px" clearable
                                                    placeholder="请选择房屋类型"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="房屋建筑面积" prop="ssbe0008">
                                        <InputNumber v-model="dataSs11007.ssbe0008" style="width: 200px" :max="99999999"
                                                     placeholder="请输入房屋建筑面积" :min="0"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="房产性质" prop="ssbe0009">
                                        <dictSelect :sel_val='dataSs11007.ssbe0009' dictCode="houseproperty"
                                                    :bindData.sync="dataSs11007.ssbe0009" style="width: 200px" clearable
                                                    placeholder="请选择房产性质"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="房屋状况" prop="ssbe0010">
                                        <dictSelect :sel_val='dataSs11007.ssbe0010' dictCode="housecondition"
                                                    :bindData.sync="dataSs11007.ssbe0010" style="width: 200px" clearable
                                                    placeholder="请选择房屋状况"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="房产证发证时间">
                                        <DatePicker type="date" v-model="dataSs11007.ssbe0011" style="width: 200px"
                                                    placeholder="请选择房产证发证时间"  :editable="false"></DatePicker>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="房屋间数">
                                        <InputNumber :min="0" v-model="dataSs11007.ssbe0012" style="width: 200px" :max="999"
                                                     placeholder="请输入房屋间数"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="取暖形式" prop="ssbe0013">
                                        <dictSelect :sel_val='dataSs11007.ssbe0013' dictCode="warmtype"
                                                    :bindData.sync="dataSs11007.ssbe0013" style="width: 200px" clearable
                                                    placeholder="请选择取暖形式"/>

                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="供暖公司">
                                        <Input v-model="dataSs11007.ssbe0014" placeholder="请输入供暖公司" style="width: 200px" maxlength="30"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="是否农村住房">
                                        <dictSelect :sel_val='dataSs11007.ssbe0015' dictCode="yesorno"
                                                    :bindData.sync="dataSs11007.ssbe0015" style="width: 200px" clearable
                                                    placeholder="请选择是否农村住房"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="是否申请危房鉴定">
                                        <dictSelect :sel_val='dataSs11007.ssbe0016' dictCode="yesorno"
                                                    :bindData.sync="dataSs11007.ssbe0016" style="width: 200px" clearable
                                                    placeholder="请选择是否申请危房鉴定"/>

                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="鉴定结论">
                                        <dictSelect :sel_val='dataSs11007.ssbe0017' dictCode="appraisalconclusion"
                                                    :bindData.sync="dataSs11007.ssbe0017" style="width: 200px" clearable
                                                    placeholder="请选择鉴定结论"/>

                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="住房结构" prop="ssbe0018">
                                        <dictSelect :sel_val='dataSs11007.ssbe0018' dictCode="housestructure"
                                                    :bindData.sync="dataSs11007.ssbe0018" style="width: 200px" clearable
                                                    placeholder="请选择住房结构"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="是否享受购建房补助">
                                        <dictSelect :sel_val='dataSs11007.ssbe0019' dictCode="yesorno"
                                                    :bindData.sync="dataSs11007.ssbe0019" style="width: 200px" clearable
                                                    placeholder="请选择是否享受购建房补助"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="房屋估值">
                                        <InputNumber :min="0" v-model="dataSs11007.ssbe0020" style="width: 200px" :max="99999999"
                                                     placeholder="请输入房屋估值"/>
                                    </FormItem>
                                </td>
                            </tr>
                        </table>
                    </Form>
                    <div slot="footer">
                        <Button type="text" size="large" @click="modalSs11006 = false">取消</Button>
                        <template v-if="!disableSubmit">
                            <Button type="primary" size="large" @click="handleSubmit('dataSs11007')">确定</Button>
                        </template>
                    </div>
                </Modal>
            </div>
            <div style="margin-top: 10px">
                <Table :columns="columns" :data="tableData" :loading="Loading" border>
                    <template slot-scope="{ row, index }" slot="action">
                        <Button type="info" size="small" @click="handleEdit(index)" style="margin-right:5px">编辑</Button>
                        <Button type="error" size="small" @click="handleDelete(row.id)" style="margin-right: 5px">删除
                        </Button>
                        <Button type="success" size="small" @click="handleDetail(index)" style="margin-right:5px">详情
                        </Button>
                    </template>
                </Table>
                <div style="margin: 10px;overflow: hidden">
                    <div style="float: right;">
                        <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                              @on-change="handleTableChange" :current="pageNo"></Page>
                    </div>
                </div>
            </div>
        </div>
        <div style="height:40px;line-height:40px;margin-top:10px;text-align: center">
            <Button @click="prevStep">上一步</Button>
            <Button type="primary" @click="nextStep()" :loading="btnLoading" style="margin-left:20px">下一步</Button>
        </div>
    </div>
</template>
<script>
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import dictSelect from '@/components/dictSelect/dictSelect.vue'
    import {postAction} from '@/api/request'
    import DateFormat from '@/plugins/format.js'

    export default {
        created() {
            let that = this;
            that.familyInfo = that.$parent.familyInfo;
            that.ss11001Id = that.familyInfo.ss11001Id;
            that.queryParam.azcp0500 = that.familyInfo.ss11001Id;
            this.loadData();
            that.serviceParam.azcp0500 = that.familyInfo.ss11001Id;
        },
        mixins: [CommonMixin],
        components: {
            dictSelect
        },
        data() {
            return {
                LoadingModal: false,
                dataCount: 0,
                ss11001Id: '',
                familyInfo: {},
                serviceParam: {
                    azcp0500: ''
                },
                queryParam: {},
                disableSubmit: false,
                modalSs11006: false,
                dataSs11007: {},
                btnLoading: false,
                Loading: false,
                tableData: [],
                family_url: '',
                support_id: '',
                family_idInfo: {},
                next_params: {},
                itemid: this.$route.params.itemid || '',
                house_url: '',
                see: this.$route.params.see || false,
                code: this.$route.params.code,
                url: {
                    list: "/api/ac/subsistence/ss11007Service/getPageList",
                    delete: "/api/ac/subsistence/ss11007Service/deleteData"
                },
                str: this.$route.params.serialNumber,
                idcardNumber: this.$route.params.idcardNumber,
                ss11002Id: this.$route.params.ss11002Id,
                errorTitle: '保存错误',
                columns: [
                    {
                        title: '人员姓名',
                        key: 'ssbe0001_name',
                        align: 'center',
                    },
                    {
                        title: '住房情况 ',
                        key: 'ssbe0005_name',
                        align: 'center',
                    },
                    {
                        title: '房屋类型',
                        key: 'ssbe0007_name',
                        align: 'center',
                    },
                    {
                        title: '房产性质',
                        key: 'ssbe0009_name',
                        align: 'center',
                    },
                    {
                        title: '房屋状况',
                        key: 'ssbe0010_name',
                        align: 'center',
                    },
                    {
                        title: '取暖形式',
                        key: 'ssbe0013_name',
                        align: 'center',
                    },
                    {
                        title: '操作',
                        align: 'center',
                        slot: 'action',
                        width: '200px',
                        fixed: 'right'
                    }
                ],
                rules: {
                    ssbe0001: [{required: true, message: '请选择"人员姓名"', trigger: 'blur'}],
                    ssbe0005: [{required: true, message: '请选择"住房情况"', trigger: 'blur'}],
                    ssbe0007: [{required: true, message: '请选择"房屋类型"', trigger: 'blur'}],
                    ssbe0008: [{required: true, message: '请输入"房屋建筑面积"', trigger: 'blur', type: 'number'}],
                    ssbe0009: [{required: true, message: '请选择"房产性质"', trigger: 'blur'}],
                    ssbe0010: [{required: true, message: '请选择"房产状况"', trigger: 'blur'}],
                    ssbe0013: [{required: true, message: '请选择"取暖形式"', trigger: 'blur'}],
                    ssbe0018: [{required: true, message: '请选择"住房结构"', trigger: 'blur'}],
                },
                data1: [],
                data2: [],
                data3: [],
                data4: [],
                dataF1: [],
                order_state: this.$route.params.order_state,
                form_params: {
                    ss11001Data: {},
                    ss11002Data: [],
                    ss11003Data: [],
                    ss11004Data: [],
                    ss11005Data: [],
                    ss11006Data: [],
                    ss11007Data: [],
                    ss11008Data: [],
                    ss11009Data: [],
                    ss11010Data: [],
                    ss11012Data: [],
                    ss12001Data: {}
                },
                houseproperty_arr: []
            }
        },
        methods: {
            prevStep() {
                this.$emit('prevStep')
            },
            nextStep() {
                let that = this;
                this.$emit('nextStep')
            },
            handleAdd() {
                this.$refs['dataSs11007'].resetFields();
                let that = this;
                that.title = "录入";
                that.disableSubmit = false;
                that.modalSs11006 = true;
                that.dataSs11007 = new Object();
                that.dataSs11007.ssbe0011 = undefined;
                that.dataSs11007.ssbe0008 = null;
                that.dataSs11007.ssbe0012 = null;
                that.dataSs11007.ssbe0020 = null;
            },
            handleEdit(index) {
                let that = this;
                that.title = "编辑";
                that.disableSubmit = false;
                let record = that.tableData[index];
                if (record.id) {
                    that.modalSs11006 = true;
                    that.dataSs11007 = Object.assign({}, record);
                    that.dataSs11007.ssbe0011 = new Date(record.ssbe0011);
                    if (that.dataSs11007.ssbe0012 == undefined || that.dataSs11007.ssbe0012 == ''){
                        that.dataSs11007.ssbe0012 = null
                    }
                    if (that.dataSs11007.ssbe0020 == undefined || that.dataSs11007.ssbe0020 == ''){
                        that.dataSs11007.ssbe0020 = null
                    }
                } else {
                    that.modalSs11006 = false
                }
            },
            handleDetail(index) {
                let that = this;
                that.title = "详情";
                that.disableSubmit = true;
                let record = that.tableData[index];
                if (record.id) {
                    that.modalSs11006 = true;
                    that.dataSs11007 = Object.assign({}, record);
                    if (that.dataSs11007.ssbe0012 == undefined || that.dataSs11007.ssbe0012 == ''){
                        that.dataSs11007.ssbe0012 = null
                    }
                    if (that.dataSs11007.ssbe0020 == undefined || that.dataSs11007.ssbe0020 == ''){
                        that.dataSs11007.ssbe0020 = null
                    }
                } else {
                    that.modalSs11006 = false
                }
            },
            handleSubmit(name) {
                let that = this;
                that.LoadingModal = true;
                that.$refs[name].validate((valid) => {
                    if (valid) {
                        let dataParam = {
                            id: that.dataSs11007.id,
                            ssbe0001: that.dataSs11007.ssbe0001,
                            ssbe0002: that.dataSs11007.ssbe0002,
                            ssbe0003: that.dataSs11007.ssbe0003,
                            ssbe0004: that.dataSs11007.ssbe0004,
                            ssbe0005: that.dataSs11007.ssbe0005,
                            ssbe0006: that.dataSs11007.ssbe0006,
                            ssbe0007: that.dataSs11007.ssbe0007,
                            ssbe0008: that.dataSs11007.ssbe0008,
                            ssbe0009: that.dataSs11007.ssbe0009,
                            ssbe0010: that.dataSs11007.ssbe0010,
                            ssbe0011: "",
                            ssbe0012: that.dataSs11007.ssbe0012,
                            ssbe0013: that.dataSs11007.ssbe0013,
                            ssbe0014: that.dataSs11007.ssbe0014,
                            ssbe0015: that.dataSs11007.ssbe0015,
                            ssbe0016: that.dataSs11007.ssbe0016,
                            ssbe0017: that.dataSs11007.ssbe0017,
                            ssbe0018: that.dataSs11007.ssbe0018,
                            ssbe0019: that.dataSs11007.ssbe0019,
                            ssbe0020: that.dataSs11007.ssbe0020
                        };
                        if (DateFormat(that.dataSs11007.ssbe0011, 'YYYY-MM-DD') === "" || DateFormat(that.dataSs11007.ssbe0011, 'YYYY-MM-DD') === "NaN-NaN-NaN") {
                            dataParam.ssbe0011 = undefined;
                        } else {
                            dataParam.ssbe0011 = DateFormat(that.dataSs11007.ssbe0011, 'YYYY-MM-DD');
                        }
                        that.Loading = true;
                        let url = "/api/ac/subsistence/ss11007Service/insertData";
                        if (that.dataSs11007.id) {
                            url = "/api/ac/subsistence/ss11007Service/updateData";
                        }
                        postAction(url, dataParam).then((res) => {
                            if (res.data.errcode != 0) {
                                this.$Message.error(res.data.errmsg);
                            } else {
                                this.modalFormOk();
                                this.modalSs11006 = false;
                            }
                        }).finally(() => {
                            that.Loading = false;
                            that.LoadingModal = false;
                        });
                    } else {
                        that.LoadingModal = false;
                    }
                })
            },
            nextPage() {
                this.$router.push({
                    name: 'db_workunit',
                    params: this.next_params
                })
            },
            next() {
                this.$router.push({
                    name: 'db_workunit',
                    params: this.next_params
                })
            },
        },
        mounted() {
        }
    }
</script>
<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }

    .head-img1 {
        height: 200px;
        width: 250px;
        margin-top: 15px;
    }

    .head-img {
        height: 200px;
        width: 250px;
    }

    .imgBackColor {
        background-color: WhiteSmoke;
        height: 250px;
    }

    .positiveTDiv {
        height: 240px;
        width: 75px;
        line-height: 240px;
        background-color: #7CCD7C;
        margin-bottom: 10px;
        color: white;
        font-size: 14px;
        font-weight: 700;
    }

</style>
